<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>4S店后台管理</title>
    <link rel="shortcut icon" href="assets/images/car.icon">
    <link rel="stylesheet" href="common/css/reset.css">
    <link rel="stylesheet" href="common/css/index.css">
    <link rel="stylesheet" href="node_modules/animate.css/animate.min.css">
    <link rel="stylesheet" href="node_modules/swiper/swiper-bundle.css">
    <script src="node_modules/jquery/dist/jquery.min.js"></script>
    <script>
        var sessionStr = sessionStorage.getItem("username");
        // console.log(sessionStr);
        var url = `http://127.0.0.1:3000/login/yz?username=${sessionStr}`
        $.get(url, data => {
            // console.log(data);
            if (data.code == 401) {
                alert('请登陆后再访问');
                location.href = 'login.html';
            }
        })
    </script>
</head>

<body>
    <div id="homepage">
        <div id="logo" style="overflow:hidden"></div>
        <div id="spa">
            <div id="menu"></div>
            <div id="main"></div>
        </div>
    </div>
    <script src="node_modules/swiper/swiper-bundle.min.js"></script>
    <script src="node_modules/moment/moment.js"></script>
    <script src="node_modules/echarts/dist/echarts.js"></script>
    <script>
        $('#logo').load('./components/logo/logo.html', () => {
            //  页面在刷新时，即首次加载时，需要触发页面的加载操作
            changePage()
        })
        $('#menu').load('./components/menu/menu.html')
        //  监听hash值的变化，当用户点击不同的a标签时，产生变化
        addEventListener('hashchange', changePage)
        function changePage() {
            window.reachBottom = null
            const h = location.hash.substr(1)
            const params = new URLSearchParams(h)
            const p = params.get('p') || 'home'
            //  把变量拼接称路径
            const path = `./pages/${p}/${p}.html`
            $('#main').load(path, function () {
                //  当页面加载完毕后，同步加载其对应的css和js
                $(this).append(`<link rel="stylesheet" href="pages/${p}/${p}.css">`)
                //  问题：不能在脚本中书写 /script>,会冲突
                //  所以：必须用DOM方式创建脚本标签
                const s = document.createElement('script')
                s.src = `pages/${p}/${p}.js`
                $(this).append(s)
            })
        }
        
    </script>
</body>

</html>